<template>
  <div class="empty-state">
    <p>.{{ previewType }}文件类型无法预览</p>
    <p>建议下载至本地查看</p>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
  name: 'ExtraPreview',
  props: {
    previewType: {
      type: String,
      default: ''
    }
  }
})
</script>
<style lang="stylus" scoped>
.empty-state {
  display flex
  justify-content center
  align-items center
  flex-direction column
  img {
    width 300px
    height 200px
  }
  p {
    font-size 16px
    font-weight 600
    color #000
    opacity 0.8
    line-height 22px
  }
  p:last-child {
    font-size 14px
    font-weight 400
    opacity 0.3
    line-height 32px
  }
}
</style>
